$(function () {

    // 浏览条点击消失
    var $error = $("#error");
    var $browse = $(".browse")
    $error.on("click", function (e) {
        e.stopPropagation()
        $browse.hide()
    })
    // // // 懒加载
    // $(".img").lazyload();

    // 模糊搜索
    var search_ipt = $("#search");
    var list_ele = $("#list");

    search_ipt.on("input", function () {
        // 核心就是发送一个携带合理数据的jsonp请求; 
        // - ajax发送请求最重要的就是 ： 
        // - 1. 请求方式 ; 
        // - 2. 请求携带的数据; 

        var options = {
            url: "https://www.baidu.com/sugrec",
            data: {
                prod: "pc",
                from: "pc_web",
                wd: search_ipt.val()
            },
            jsonp: "cb",
            dataType: "jsonp",
            success: function (res) {
                render(res);
            }
        }
        $.ajax(options)
    })

    function render(data) {
        if (data.g instanceof Array) {
            // 根据返回的数据，去渲染html结构，让后把html结构放入到list元素之中; 
            var html = data.g.map(function (item) {
                return `<li>${item.q}</li>`
            }).join("");
            list_ele.html(html);
        } else {
            list_ele.html("");
        }
    }


    // 吸顶菜单

    var $nav = $(".nav");
    var $header = $(".header-center img");
    var $nav_ele = $(".nav-rights");
    var $nav_left = $(".nav-left")
    $(window).on("scroll", function () {
        var scrollTop = $("body,html").scrollTop();
        if (scrollTop >= 145) {
            $nav.css({
                position: "fixed",
                top: "0",
                left: "0",
            }),
                $nav_left.css({
                    marginLeft: "100px"
                })
            $header.css({
                position: "fixed",
                top: "20px",
                left: " 30px",
                zIndex: "999",
                width: "50px",
                height: "50px"

            })
            $nav_ele.css({
                top: "0",
                right: "50px",

            })

        } else {
            $nav.css({
                position: "inherit"
            })
            $nav_left.css({
                marginLeft: "0px"
            })
            $header.css({
                position: "static",
                width: "100px",
                height: "100px"
            })
            $nav_ele.css({
                top: "140px",
                right: " 50px"
            })
        }
    })



    // 显示隐藏
    var $fsat_nav = $(".fast-nav")
    var $nav_one = $(".nav_one")

    $fsat_nav.click(function () {
        $nav_one.css({
            display: "block"
        })
    })
})